<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!-- All Spring messages used in this view are declared below with a variable -->
<spring:message code="tripbooking.create" var="newbooking_lbl"/>
<spring:message code="customer.info" var="booker_lbl"/>
<spring:message code="customer.name" var="name_lbl"/>
<spring:message code="customer.birthdate_lbl" var="birthdate_lbl"/>
<spring:message code="customer.address_lbl" var="address_lbl"/>
<spring:message code="customer.streetname_lbl" var="streetname_lbl"/> 
<spring:message code="customer.housenumber_lbl" var="housenumber_lbl"/> 
<spring:message code="customer.postalcode_lbl" var="postalcode_lbl"/>
<spring:message code="customer.postalcodeExample_lbl" var="postalcode_example_lbl"/>
<spring:message code="customer.abode_lbl" var="city_lbl"/>
<spring:message code="customer.country_lbl" var="country_lbl"/>
<spring:message code="customer.emailaddress_lbl" var="emailaddress_lbl"/>
<spring:message code="customer.phonenumber_lbl" var="phonenumber_lbl"/>
<spring:message code="tripbooking.confirm" var="confirm_btn"/>
<spring:message code="trip.days_lbl" var="trip_days"/>
<spring:message code="trip.nights_lbl" var="trip_nights"/>
<spring:message code="trip.amountofnights_lbl" var="trip_amountofnights"/>
<c:set var="amount_days" value="${trip.amount_nights + 1} ${trip_days}"/>

<div class="col-md-12">
    <h4>${newbooking_lbl}</h4>
    <div class="col-md-12">
        <div class="panel panel-info" style="padding-bottom:10px">
            <div class="panel-heading" style="margin-bottom:4px;">
                ${booker_lbl}
            </div>
            <div class="panel-body">
                <div class="col-md-7">
                    <div class="form-group">
                        <label class="col-md-6 col-sm-6">${name_lbl}</label>
                        <p class="col-md-6 col-sm-6 labelStyle">${customerviewmodel.customer.surname} ${customerviewmodel.customer.lastname}</p>
                    </div>
                    <div class="form-group">
                        <label class="col-md-6 col-sm-6">${birthdate_lbl}</label>
                        <p class="col-md-6 col-sm-6 labelStyle"><fmt:formatDate value="${customerviewmodel.customer.birthdate}" pattern="dd-MM-yyyy" /></p>
                    </div>
                    <div class="form-group">
                        <label class="col-md-6 col-sm-6">${address_lbl}</label>
                        <p class="col-md-6 col-sm-6 labelStyle">${customerviewmodel.customer.streetAddress} ${customerviewmodel.customer.houseNumber}</p>
                        <p class="col-md-6 col-sm-6 labelStyle"></p>
                        <p class="col-md-6 col-sm-6 labelStyle">${customerviewmodel.customer.postalCode} ${customerviewmodel.customer.city}</p>
                    </div>
                </div>
                <div class="col-md-5">
                    <div class="form-group">
                        <label class="col-md-6 col-sm-6">${emailaddress_lbl}</label>
                        <p class="col-md-6 col-sm-6 labelStyle">${customerviewmodel.customer.email}</p>
                    </div>
                    <div class="form-group">
                        <label class="col-md-6 col-sm-6">${phonenumber_lbl}</label>
                        <p class="col-md-6 col-sm-6 labelStyle">${customerviewmodel.customer.telephone1}</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-12">
        <div class="panel panel-info" style="padding-bottom:10px">
            <div class="panel-heading" style="margin-bottom:4px;">
                Reisgegevens
            </div>
            <div class="panel-body">
                <h4>${trip.title}</h4>
                <p class="labelStyle">
                    Aantal personen: ${trip.minPersons}<br>
                    Aantal dagen: ${amount_days} (${trip.amount_nights} overnachtingen)<br>
                    Vertrekdatum: ${departuredate}<br>
                    Terugkomstdatum: ${returndate}<br>
                </p>     
                <h4>Accommodaties</h4>
                <c:forEach var="accommodation" items="${accommodations}">
                    <div class="predefinedDetails leftalign col-md-4">
                        <div class="col-md-1">
                            <h4>${accommodation.accommodationIndex}.</h4>
                        </div>
                        <div class="col-md-11">
                            <p class="pPredefinedDetails">
                                ${accommodation.title}<br>
                                ${accommodation.country.name} / ${accommodation.city.name}
                            </p>
                            <p class="pPredefinedDetails">${accommodation.description}</p>
                            <p class="pPredefinedDetails">${accommodation.accommodationType.type}</p>
                            <p class="pPredefinedDetails"> ${trip_amountofnights}: ${accommodation.amountOfNights} </p>
                        </div>
                    </div>
                </c:forEach>
            </div>
        </div>
    </div>
    <div style="clear:both;">        
        <form:form class="form-horizontal" action="${pageContext.request.contextPath}/trip/book/${trip.id}" method="POST" modelAttribute="tripbooking">
<!--            <input class="submit" name="submit" type="submit" value="${confirm_btn}"/>-->
            <form:button class="submit" name="submit" value="${confirm_btn}">${confirm_btn}</form:button>
        </form:form>
    </div>
</div>
